<template>
	<view>
		<view class="page">
			<comp-common v-bind="{data:data}" @getUserInfo="getUserInfo" @myLogin="myLogin" @getPhoneNumber="getPhoneNumber" @hideGetCoupon="hideGetCoupon" @closeCouponBox="closeCouponBox" @navigatorClick="navigatorClick"></comp-common>
			<comp-header v-bind="{data:data}" @relevanceError="relevanceError" @relevanceSuccess="relevanceSuccess"></comp-header>
			<view class="body after-navber">
				<view class="bottom-bar" style="display: none">
            <navigator url="/pages/address-edit/address-edit">添加新地址</navigator>
        </view>
        <view class="address-list">
            <view style="margin-bottom: 32upx">
                <view style="color: #888;text-align: center;padding: 32upx 0;" v-if="data.address_list.length==0">暂无收货地址</view>
                <block v-else>
                    <view @tap="pickAddress" class="address-item" :data-index="index" v-for="(item,index) in data.address_list" :key="index">
                        <view class="userinfo flex-row">
                            <view class="flex-grow-1">收货人：{{item.name}}</view>
                            <view class="flex-grow-0">{{item.mobile}}</view>
                        </view>
                        <view class="address-detail">收货地址：{{item.address}}</view>
                    </view>
                </block>
            </view>
            <view class="flex-row">
                <view class="flex-grow-1 px-24">
                    <navigator class="btn btn-red" url="/pages/address-edit/address-edit">手动添加地址</navigator>
                </view>
                <view class="flex-grow-1 px-24" v-if="data.__platform=='wx'">
                    <button @tap="getWechatAddress" class="btn btn-green">一键获取地址</button>
                </view>
            </view>
        </view>
			</view>
			<comp-footer v-bind="{data:data}"></comp-footer>
		</view>
	</view>
</template>

<script>var myVue = {};
	export default {
		data() {
			return {
				data: {
					address_list: []
				},
			};
		},
		onLoad: function(e) {myVue = this;
        myVue.getApp.page.onLoad(this, e);
    },
    onShow: function() {
        myVue.getApp.page.onShow(this);
        var e = this;
        myVue.getApp.core.showNavigationBarLoading(), myVue.getApp.request({
            url: myVue.getApp.api.user.address_list,
            success: function(t) {
                e.getApp.core.hideNavigationBarLoading(), 0 == t.code && e.setData({
                    address_list: t.data.list
                });
            }
        });
    },
		methods:{
			pickAddress: function(e) {
        var t = e.currentTarget.dataset.index, a = this.data.address_list[t];
        myVue.getApp.core.setStorageSync(myVue.getApp.const.PICKER_ADDRESS, a), myVue.getApp.core.navigateBack();
    },
    getWechatAddress: function(e) {
				var _this = this;
        myVue.getApp.core.chooseLocation({
            success: function(e) {
                "chooseLocation:ok" == e.errMsg && (myVue.getApp.core.showLoading(), myVue.getApp.request({
                    url: myVue.getApp.api.user.add_wechat_address,
                    method: "post",
                    data: {
                        national_code: e.nationalCode,
                        name: e.userName,
                        mobile: e.telNumber,
                        detail: e.detailInfo,
                        province_name: e.provinceName,
                        city_name: e.cityName,
                        county_name: e.countyName
                    },
                    success: function(e) {
                        1 != e.code ? 0 == e.code && (myVue.getApp.core.setStorageSync(myVue.getApp.const.PICKER_ADDRESS, e.data), 
                        myVue.getApp.core.navigateBack()) : myVue.getApp.core.showModal({
                            title: "提示",
                            content: e.msg,
                            showCancel: !1
                        });
                    },
                    complete: function() {
                        myVue.getApp.core.hideLoading();
                    }
                }));
            }
        });
    }
		}
	}
</script>

<style scoped>
.bottom-bar {
    position: fixed;
    bottom: var(--window-bottom);
    left: 0;
    width: 100%;
    z-index: 1000;
}

.bottom-bar navigator {
    background: #ff4544;
    text-align: center;
    height: 100upx;
    line-height: 100upx;
    color: #fff;
}

.address-list {
    padding-bottom: 100upx;
}

.address-item {
    background: #fff;
    padding: 32upx 24upx;
    border-bottom: 1upx solid #E3E3E3;
}

.userinfo {
    margin-bottom: 24upx;
}

.address-detail {
}

.address-option {
    margin-left: 48upx;
}

.address-option image {
    width: 32upx;
    height: 32upx;
    margin-right: 16upx;
}

.btn {
    display: block;
    border: 1upx solid #ddd;
    color: #555;
    padding: 16upx;
    line-height: normal;
    background: #fff;
    border-radius: 10upx;
    text-align: center;
}

.btn:active {
    background: #fff;
    opacity: .65;
}

.btn:after {
    display: none;
}

.btn.btn-green {
    background: #09bb07;
    color: #fff;
    border-color: #09bb07;
}

.btn.btn-red {
    background: #ff4544;
    color: #fff;
    border-color: #ff4544;
}
</style>
